<script>
import {
  Component,
  Emit,
  Inject,
  Model,
  Prop,
  Provide,
  Vue,
  Watch
} from "vue-property-decorator";

@Component
export default class App extends Vue {
  @Prop({ type: Object, default: () => ({}) })
  option;

  getFile(event) {
    var file = event.target.files;
    if(file.length){
      this.$emit("uploadFile",{ file:file[0] })
    }
    // for (var i = 0; i < file.length; i++) {
    //   // 上传类型判断
    //   var imgName = file[i].name;
    //   var idx = imgName.lastIndexOf(".");
    //   if (idx != -1) {
    //     var ext = imgName.substr(idx + 1).toUpperCase();
    //     ext = ext.toLowerCase();
    //     if (ext != "pdf" && ext != "doc" && ext != "docx") {
    //     } else {
    //       this.addArr.push(file[i]);
    //     }
    //   } else {
    //   }
    // }
  }

  render(createElement) {
    return (
      <div class="upload_file" >
        <input type="file" onChange={this.getFile} multiple="multiplt" />
        <el-button>上传文件</el-button>
      </div>
    );
  }
}
</script>

<style lang="less" scoped >
.upload_file{
  margin-top: 20px;
  display: inline-block;
  position: relative;
  >input{ 
    width: 98px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    opacity: 0;
  }
}

</style>